import { useSelector, useDispatch } from 'umi';

const Index = () => {
  const name = useSelector((state: any) => state.index.name);
  const count = useSelector((state: any) => state.index.count);
  const dispatch = useDispatch();

  const handleClick = () => {
    dispatch({
      type: 'index/changeName',
      name: 'wangwu',
    });
  };

  const add = () => {
    dispatch({
      type: 'index/add',
    });
  };

  const add2 = () => {
    dispatch({
      type: 'index/asyncAdd',
    });
  };

  return (
    <>
      <h2>dva</h2>
      <p>name: {name}</p>
      <button onClick={handleClick}>btn</button>

      <p>count: {count}</p>
      <button onClick={add}>+1</button>
      <button onClick={add2}>async +1</button>
    </>
  );
};

export default Index;
